<template>
  <div class="findTalk">
    <div class="talkGoods" v-for="(value,key,index) in allTalk" :key="key">
      <div class="talks" @click="itemClick(index,item)">
        <h3 >{{value.content}}</h3>
        <div class="divSpan">
        <span>{{value.topicSum}}个话题</span><span>{{value.topicHot}}热议</span>
        </div>
      </div>
    </div>
  </div>
</template>

<script setup>
import axios from 'axios';
import {ref } from 'vue'
import {useRouter} from 'vue-router'
import perfume from './perfume.vue'
import {getTopicList,} from "./indexJS/findTalk"

const allTalk = ref()
getTopicList().then(res=>{
  allTalk.value=res.page.list
  console.log(allTalk.value);
})

const router = useRouter()
const itemClick = () =>{
    router.push("/perfume")
 }
</script>

<style lang="scss" scoped>

.talkGoods {
  display: flex;
  margin: 20px 5px;
  box-shadow: 1px 1px 5px #909090;
  .talks {
    display: flex;
    width: 335px;
    height: 350px;
    flex-direction: column;
    background-image: url('@/assets/img/find/233a161dd71cc98863185bc190c6f7df.png');
    h3 {
      color: #333333;
      padding-left: 20px;
      margin-top: 290px;
    }
    
    .divSpan{
        padding-top: 10px;
        span{
        padding-left: 20px;
        color: #666666;
        font-size: 13px;
    }
    }
    
  }
}
</style>